<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>打考勤</title>
	<meta name="renderer" content="webkit">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<link rel="stylesheet" href="../../layui/css/layui.css"  media="all">
	<!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
</head>
<script src="../../layui/layui.js" charset="utf-8"></script>
<body style="padding: 10px;background-color: rgb(236,240,245);">
	<h1 style="margin-bottom: 20px;">打考勤</h1>
	<!-- 表单区+返回按钮 -->
	<div style="background-color: white;">
		<div class="layui-row" style="padding-top: 3.75rem;">
			<div class="layui-col-xs4 layui-col-xs-offset3">
				<button class="layui-btn layui-btn-normal" style="width: 15.625rem; height: 15.625rem;border-radius: 100%;font-size: 3rem;">签到</button>
			</div>
			<div class="layui-col-xs4">
				<button class="layui-btn layui-btn-danger" style="width: 15.625rem; height: 15.625rem;border-radius: 100%;font-size: 3rem;">签退</button>
			</div>
		</div>
		<div class="layui-row" style="padding-bottom: 100px;padding-top: 20px;">
			<div class="layui-col-xs4 layui-col-xs-offset3">
				<span id="signIn" style="font-size: 1.5rem;padding-left: 3.125rem;"></span>
			</div>
			<div class="layui-col-xs4">
				<span id="signOut" style="font-size: 1.5rem;padding-left: 3.125rem;"></span>
			</div>
		</div>
	</div>
</body>
<script>
	setInterval("signIn.innerHTML=getCurrTime()",1000);
	setInterval("signOut.innerHTML=getCurrTime()",1000);
	
	/**
	 * 获取当前时间（格式：上午hh:mm:ss）
	 */
	function getCurrTime(){
		var curDate = new Date().toLocaleTimeString();
		return curDate;
	}
</script>
</html>